<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <link rel="icon" href="/favicon.ico" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>企业信息管理平台</title>
        <style>
            * {
                margin: 0;
            }
            
            ._first-loading {
                display: flex;
                justify-content: center;
                align-items: center;
                height: 100vh;
                background: linear-gradient(135deg, #7fa4bd 45%, #4a92b9 65%, #26a0da 85%, #3eade2);
            }
            
            ._first-loading .dot {
                animation: _first-loading-rotate 1.2s infinite linear;
                transform: rotate(45deg);
                position: relative;
                width: 32px;
                height: 32px;
                box-sizing: border-box;
            }
            
            ._first-loading .dot i {
                width: 12px;
                height: 12px;
                position: absolute;
                display: block;
                background-color: #ffc34a;
                border-radius: 100%;
                opacity: 0.5;
                animation: _first-loading-opacity 1s infinite linear alternate;
            }
            
            ._first-loading .dot i:nth-child(1) {
                top: 0;
                left: 0;
            }
            
            ._first-loading .dot i:nth-child(2) {
                top: 0;
                right: 0;
                animation-delay: 0.4s;
            }
            
            ._first-loading .dot i:nth-child(3) {
                right: 0;
                bottom: 0;
                animation-delay: 0.8s;
            }
            
            ._first-loading .dot i:nth-child(4) {
                bottom: 0;
                left: 0;
                animation-delay: 1.2s;
            }
            
            @keyframes _first-loading-rotate {
                100% {
                    transform: rotate(405deg);
                }
            }
            
            @keyframes _first-loading-opacity {
                100% {
                    opacity: 1;
                }
            }
            </style>
    </head>
    <body>
        <div id="app">
            <div class="_first-loading">
                <div class="dot"><i></i><i></i><i></i><i></i></div>
            </div>
        </div>
        <script type="module" src="/src/main.js"></script>
    </body>
</html>
